/*
 * @Author: mikey.zhaopeng 
 * @Date: 2019-01-01 16:16:46 
 * @Last Modified by: mikey.zhaopeng
 * @Last Modified time: 2019-01-12 09:37:32
 */
import 'package:flutter/material.dart';
import '../constants.dart' show AppColors, AppFontSize;

class BoutiqueItem extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return GestureDetector(
      child: Container(
        padding: const EdgeInsets.only(
            left: 15.0, right: 15.0, bottom: 20.0, top: 5.0),
        decoration: BoxDecoration(
          border: Border(
            bottom: BorderSide(
              width: 1.0,
              color: Color(AppColors.jpItemBorderColor),
            ),
          ),
        ),
        child: Column(
          children: <Widget>[
            Container(
              // height: 44.0,
              color: Colors.white,
              alignment: Alignment.centerLeft,
              child: Text(
                "超一流游戏画质，巅峰美术大作-橙子最新出品",
                style: TextStyle(
                  color: Color(AppColors.jpItemTitleColor),
                  fontSize: AppFontSize.tabBarFontSize,
                ),
              ),
            ),
            AspectRatio(
              aspectRatio: 2 / 1,
              child: FadeInImage(
                placeholder: AssetImage('assets/images/home/banner.png'),
                image: AssetImage('assets/images/home/banner.png'),
              ),
            ),
            Container(
              height: 60.0,
              margin: const EdgeInsets.only(top: 15.0),
              child: Row(
                children: <Widget>[
                  Container(
                    width: 50.0,
                    height: 50.0,
                    margin: const EdgeInsets.only(right: 10.0),
                    decoration: BoxDecoration(
                      borderRadius: BorderRadius.all(
                        Radius.circular(5.0),
                      ),
                    ),
                    child: FadeInImage(
                      placeholder: AssetImage('assets/images/home/icon@3x.png'),
                      image: AssetImage('assets/images/home/icon@3x.png'),
                    ),
                  ),
                  Expanded(
                    flex: 1,
                    child: Column(
                      mainAxisAlignment: MainAxisAlignment.spaceBetween,
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: <Widget>[
                        Text(
                          "新水浒",
                          style: TextStyle(
                              fontSize: 14.0, color: Color(0xff333333)),
                        ),
                        Row(
                          children: <Widget>[
                            Container(
                              margin: const EdgeInsets.only(right: 5.0),
                              child: Image.asset(
                                'assets/images/home/i@3x.png',
                                height: 12.0,
                                width: 12.0,
                              ),
                            ),
                            Text(
                              '8.5',
                              style: TextStyle(
                                fontSize: 12.0,
                                color: Color(0xffffb223),
                              ),
                            ),
                            Container(
                              height: 12.0,
                              width: 1.0,
                              color: Color(0xff999999),
                              margin:
                                  const EdgeInsets.only(left: 5.0, right: 5.0),
                            ),
                            Text(
                              '139M·仙侠',
                              style: TextStyle(
                                fontSize: 12.0,
                                color: Color(0xff999999),
                              ),
                            ),
                          ],
                        ),
                        Row(
                          children: <Widget>[
                            GameType(name: '养成'),
                            GameType(name: '策略'),
                            GameType(name: '新游上线'),
                          ],
                        )
                      ],
                    ),
                  ),
                  Container(
                    height: 28.0,
                    width: 56.0,
                    child: OutlineButton(
                      highlightElevation: 4,
                      padding: const EdgeInsets.all(0),
                      borderSide: BorderSide(
                        color: Color(0xff1faed6),
                      ),
                      color: Color(0xffffffff),
                      textColor: Color(0xff1faed6),
                      onPressed: () {},
                      child: Text('详情',style: TextStyle(fontSize: 14.0),),
                    ),
                  ),
                ],
              ),
            )
          ],
        ),
      ),
    );
  }
}

class GameType extends StatelessWidget {
  final String name;
  GameType({Key key, @required this.name}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Container(
      padding: const EdgeInsets.symmetric(horizontal: 5.0, vertical: 0.0),
      margin: const EdgeInsets.only(right: 5.0),
      decoration: BoxDecoration(
          border: Border.all(
            width: 1.0,
            color: Color(0xfffe5ba8),
          ),
          borderRadius: BorderRadius.all(
            Radius.circular(4.0),
          )),
      child: Text(
        name,
        style: TextStyle(fontSize: 12.0),
      ),
    );
  }
}
